<section id="rebase-editor" class="section--settings section--collapsible">
	<div class="section__header">
		<div class="setting__input setting__input--big">
			<input
				id="rebaseEditor.enabled"
				name="rebaseEditor.enabled"
				type="checkbox"
				data-setting
				data-setting-type="custom"
			/>
			<label for="rebaseEditor.enabled">Interactive Rebase Editor</label>
			<a
				class="link__learn-more"
				title="Learn more"
				href="https://help.gitkraken.com/gitlens/gitlens-features/#interactive-rebase-editor"
			>
				<i class="icon icon__info"></i>
			</a>
		</div>

		<p class="section__header-hint">
			Adds a user-friendly interactive rebase editor to easily configure an interactive rebase session
		</p>
	</div>

	<div class="section__collapsible">
		<div class="section__group">
			<div class="section__content">
				<div class="settings settings--fixed ml-1">
					<div class="setting" data-enablement="rebaseEditor.enabled" disabled>
						<div class="setting__input setting__input--inner-select">
							<label for="rebaseEditor.ordering">Show</label>
							<div class="select-container">
								<select id="rebaseEditor.ordering" name="rebaseEditor.ordering" data-setting>
									<option value="asc">oldest commit first</option>
									<option value="desc">newest commit first (default)</option>
								</select>
							</div>
						</div>
					</div>

					<div class="setting" data-enablement="rebaseEditor.enabled" disabled>
						<div class="setting__input setting__input--inner-select">
							<input
								id="rebaseEditor.showDetailsView"
								name="rebaseEditor.showDetailsView"
								type="checkbox"
								value="selection"
								data-setting
								data-enablement="rebaseEditor.enabled"
								disabled
							/>
							<label for="rebaseEditor.showDetailsView">Show Commit Details view</label>
							<div class="select-container">
								<select
									id="rebaseEditor.showDetailsView"
									name="rebaseEditor.showDetailsView"
									data-setting
									data-enablement="rebaseEditor.enabled &amp; rebaseEditor.showDetailsView !false"
									disabled
								>
									<option value="open">only when opening</option>
									<option value="selection">when selection changes (default)</option>
								</select>
							</div>
						</div>
					</div>
				</div>
			</div>

			<div class="section__preview">
				<img
					class="image__preview hidden"
					src="#{webroot}/media/rebase-editor.webp"
					data-visibility="rebaseEditor.enabled"
					loading="lazy"
					width="600"
					height="291"
				/>
			</div>
		</div>
	</div>
</section>
